<template>
	<view>
		<view class="cashier-head">
			<view class="cashier-head-item1">支付金额(元)</view>
			<view class="cashier-head-item2">{{collection[1]}}.00</view>
		</view>
		<view class="cashier-content">
			<view class="cashier-content-item">
				<view>项目名称</view>
				<view>{{collection[0]}}</view>
			</view>
			<view class="cashier-content-item">
				<view>医院名称</view>
				<view>{{hospInfo.name}}</view>
			</view>
			<view class="cashier-content-item">
				<view>就诊人</view>
				<view>{{user.name}}</view>
			</view>
			<veiw class="cashier-content-item">
				<view>证件号</view>
				<view>{{user.certificateId}}</view>
			</veiw>
		</view>
		<view class="cashier-pay" @click="pay">微信支付</view>
	</view>
</template>

<script>
	import {mapState,mapMutations} from 'vuex'
	export default {
		data() {
			return {
				hospId:1,
				timeId:-1,
				type:-1,
				chooseMonth:-1,
				chooseDay:-1,
				certificateId:null,
				user:null,
				hospInfo:null,
				collection:[],
				orderId:-1,
				seconds:3,
				timer:null
			};
		},
		computed:{
			...mapState('m_user',['openid'])
		},
		onLoad(options) {
			this.hospId = options.hospId
			this.type = options.type
			this.chooseMonth = options.chooseMonth
			this.chooseDay = options.chooseDay
			this.certificateId = options.certificateId
			this.timeId = options.timeId
		},
		created() {
			this.getHospInfo()
		},
		mounted() {
			this.getCollection()
			this.getUser()
		},
		methods:{
			//获取核检类型
			getCollection(){
				uni.request({
					url:'http://192.168.43.224:9002/api/business/getCollectionType/'+this.type,
					method:'GET',
					success: (res) => {
						this.collection = res.data.data
					}
				})
			},
			//获取检测点名称
			getHospInfo(){
				uni.request({
					url:'http://192.168.43.224:9001/admin/hospinfo/getHospInfoById/'+this.hospId,
					method:'GET',
					success: (res) => {
						this.hospInfo = res.data.data
						console.log('获取的hosp:'+this.hospInfo)
					}
				})
			},
			
			//根据证件号获取用户信息
			getUser(){
				uni.request({
					url:'http://192.168.43.224:9002/user/getUserByCertificateId/'+this.certificateId,
					method:'GET',
					success: (res) => {
						this.user = res.data.data
					}
				})
			},
			
			//微信支付
			pay(){
				//预约订单信息
				const order = {
					itemName:this.collection[0],
					itemNum:1,
					price:this.collection[1],
					hospId:this.hospId,
					userId:this.user.id,
					openId:this.openid,
					timeId:this.timeId,
					orderTime:'2022-0'+this.chooseMonth+'-'+this.chooseDay
				}
				
				this.showTips(this.seconds)
				uni.request({
					url:'http://192.168.43.224:9002/order/createOrder',
					method:'POST',
					data:order,
					success: (res) => {
						this.orderId = res.data.data
					}
				})
				
				const result = {
					orderId:this.orderId
				}
				uni.request({
					url:'http://192.168.43.224:9002/orderresult/createOrderResult',
					method:'POST',
					data:result
				})
				
				this.timer = setInterval(()=>{
					this.seconds--
					if(this.seconds <= 0){
						//清除定时器
						clearInterval(this.timer)
						uni.navigateTo({
							url:'/subpkg/order-list-detail/order-list-detail?orderId='+this.orderId
						})
						return this.seconds = 3
					}
					this.showTips(this.seconds)
				},1000)
				
				
			},
			
			showTips(n){
				uni.showToast({
					title:'支付完成,'+n+'秒后自动跳转到详情页',
					icon:'none',
					mask:true,	//防止用户点击穿透
					duration:1500
				})
			}
		}
	}
</script>

<style lang="scss">
.cashier-head{
	height: 110px;
	background-color: #FFFFFF;
	.cashier-head-item1{
		padding-top: 15px;
		text-align: center;
	}
	.cashier-head-item2{
		padding-top: 15px;
		text-align: center;
		font-size: 40px;
		color: #F0AD4E;
	}
}
.cashier-content{
	margin-top: 15px;
	background-color: #FFFFFF;
	.cashier-content-item{
		display: flex;
		justify-content: space-between;
		height: 40px;
		padding-right: 10px;
		line-height: 40px;
		padding-left: 10px;
	}
}
.cashier-pay{
	margin-top: 20px;
	margin-left: 15px;
	width: 90%;
	border-radius: 5px;
	background-color: #40E0D0;
	height: 50px;
	font-size: 20px;
	color: #FFFFFF;
	line-height:50px;
	text-align: center;
}
</style>
